﻿<!DOCTYPE html>
<html>

<head id="Head1" runat="server">
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <title>年度指标情况</title>
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
  <link rel="Shortcut Icon" href="../images/tempoBI.ico" type="image/x-icon" />
  <link rel="stylesheet" href="../StaticFiles/layui/dist/css/layui.css" />
  <link rel="stylesheet" href="../StaticFiles/layui/admin.css" />
  <link rel="stylesheet" href="../styles/pace.css" />
  <script type="text/javascript" src="../Scripts/pace.min.js"></script>
  <script type="text/javascript" src="../Scripts/json2.js"></script>
  <script type="text/javascript" src="../Scripts/jquery-1.11.2.min.js"></script>
  <script type="text/javascript" src="../Scripts/crypto-js.min.js"></script>
  <style type="text/css">
    html {
      background-image: url(../images/bg.jpg);
      background-repeat: no-repeat;
    }

    #header {
      height: 60px;
      background-image: url(../images/抬头.png);
      background-size: 100% 60px;
      background-repeat: no-repeat;
      color: #fff;
      font-weight: bold;
      text-align: center;
      font-size: 28px;
      line-height: 60px;
    }

    #title {
      color: #fff;
      font-family: '微软雅黑';
      font-size: 20px;
      font-weight: bold;
      height: 32px;
      line-height: 32px;
    }

    .layui-card {
      background-color: transparent;
      border: 1px dashed #1E9FFF;
    }

    .layui-card-header {
      color: #fff;
      border: none;
      text-align: center;
      font-size: 20px;
      font-weight: bold;
      letter-spacing: 0.1em;
    }

    /*左上图片*/
    .bg-left-top {
      position: absolute;
      left: -2px;
      top: -2px;
      width: 25px;
      height: 25px;
      background-image: url(../images/left-top.png);
    }

    /*左下图片*/
    .bg-left-bottom {
      position: absolute;
      left: -2px;
      bottom: -2px;
      width: 25px;
      height: 25px;
      background-image: url(../images/left-bottom.png);
    }

    /*右上图片*/
    .bg-right-top {
      position: absolute;
      right: -2px;
      top: -2px;
      width: 25px;
      height: 25px;
      background-image: url(../images/right-top.png);
    }

    /*右下图片*/
    .bg-right-bottom {
      position: absolute;
      bottom: -2px;
      right: -2px;
      width: 25px;
      height: 25px;
      background-image: url(../images/right-bottom.png);
    }

    .layui-table-cell {
      text-align: center;
      color: #fff;
    }

    .layui-table {
      background-color: transparent !important;
    }

    .layui-table-view {
      margin-top: 0px;
    }

    .layui-table-header {
      background-color: transparent !important;
    }

    .layui-table-header .layui-table-cell {
      color: rgb(60, 176, 255);
      font-size: 16px;
      font-family: '微软雅黑';
      font-weight: bold;
    }

    .layui-table tr:hover {
      background-color: transparent !important;
    }

    .layui-table thead tr {
      background-color: transparent !important;
    }

    .layui-laypage a,
    .layui-laypage span {
      color: #fff;
    }

    .layui-laypage .layui-laypage-skip {
      color: #fff;
    }
  </style>
</head>

<body>
  <div class="layui-row" style="padding: 0 15px;">
    <div class="layui-col-md12">
      <div id="header">
      </div>
    </div>
  </div>
  <div class="layui-fluid" style="padding-bottom: 0px;">
    <div class="layui-row layui-col-space15">
      <div class="layui-col-md12">
        <table class="layui-table" id="grid" lay-data="{}" lay-filter="grid">
        </table>
      </div>
    </div>
  </div>
  <script src="../Scripts/echarts/echarts-5.4.0.min.js"></script>
  <script type="text/javascript" src="../StaticFiles/layui/dist/layui.js"></script>
  <script type="text/javascript">
    $(function () {

      $(".layui-card:last-child").css({ "marginBottom": "0px" });
      function getUrlParam(name) {
        var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); //构造一个含有目标参数的正则表达式对象
        var r = window.location.search.substr(1).match(reg);  //匹配目标参数
        if (r != null) return unescape(r[2]); return null; //返回参数值
      };

      //解密方法
      function Decrypt(source) {
        var key = CryptoJS.enc.Utf8.parse("12345678900000001234567890000000"); //32位
        var iv = CryptoJS.enc.Utf8.parse("1234567890000000"); //16位
        var encryptedHexStr = CryptoJS.enc.Hex.parse(source);
        var srcs = CryptoJS.enc.Base64.stringify(encryptedHexStr);
        var decrypt = CryptoJS.AES.decrypt(srcs, key, {
          iv: iv,
          mode: CryptoJS.mode.CBC,
          padding: CryptoJS.pad.Pkcs7
        });
        var decryptedStr = decrypt.toString(CryptoJS.enc.Utf8);
        return decryptedStr.toString();
      }

      var $factoryid = getUrlParam('factoryid');

      var month = Decrypt(layui.url().search.month);
      var type = Decrypt(layui.url().search.type);

      switch (type) {
        case 'safe':
          type = 'S安全'; break;
        case 'quality':
          type = 'Q质量'; break;
        case 'cost':
          type = 'C成本'; break;
        case 'person':
          type = 'P人员'; break;
        case 'delivery':
          type = 'D交付'; break;
      }

      $("#header").text(type + '年度指标情况');
      document.title = type + '年度指标情况';


      layui.use(['layer', 'table'], function () {
        var table = layui.table;
        var layer = layui.layer;

        //年度指标情况
        table.render({
          elem: '#grid'
          , url: "../handler/board/ZSYearTargetDetail.ashx"
          , method: 'POST'
          , cols: [[
            { type: 'numbers', title: '序号', width: 80 }
            , { field: 'YEARMONTH', title: '月份' }
            , { field: 'PLANQTY', title: '计划数' }
            , { field: 'COMPLETEQTY', title: '完成数' }
            , { field: 'NOTFINISHQTY', title: '未完成数' }
            , { field: 'NOTES', title: '备注信息' }
          ]]
          , where: {
            type: 'GetData',
            month: Decrypt(layui.url().search.month),
            sqcdptype: Decrypt(layui.url().search.type)
          }
          , text: {
            none: '暂无相关数据'
          }
          , request: {
            pageName: 'page',
            limitName: 'rows'
          }
          , page: {
            theme: '#009688'
          }
          , limit: 5
          , limits: [5, 10, 20, 30, 50]
          , done: function (res, curr, count) {
            var that = this.elem.next();
            res.data.forEach(function (item, index) {
              if (index % 2 !== 0) {
                var tr = that.find(".layui-table-box tbody tr[data-index='" + index + "']").css({ "background": "rgba(60, 176, 255, 0.3)" });
              }
            });
          }
        });

      });
    });
  </script>
</body>

</html>